﻿@import "../LiberUI/Style/Default/Theme";
@import "../LiberUI/Style/Default/_soIcons";

@font-face {
  font-family: 'SoIcons';
  src: url('/LiberUI/Style/Default/fonts/iconfont.eot');
  src: url('/LiberUI/Style/Default/fonts/iconfont.eot') format('embedded-opentype'), url('/LiberUI/Style/Default/fonts/iconfont.woff') format('woff'), url('/LiberUI/Style/Default/fonts/iconfont.ttf') format('truetype'), url('/LiberUI/Style/Default/fonts/iconfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

$headHeight:80px;
#headBar {
    position: fixed;
    margin: 0 auto;
    height: $headHeight;
    background-color: transparent;
    color:white;
    z-index: 99;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    transition: all ease 0.3s;
    &.focus{
        background-color:rgba(0, 0, 0,0.5);
    }
}

#siteLogo{
    height:$headHeight;
    background-image: url('/SiteUI/Imgs/logo-white.png');
    background-size:auto $headHeight;
    background-position:left center;
    background-repeat:no-repeat;
}

#siteLink{
    text-align:center;
    margin-top:1rem;
    &>a{
        display:inline-block;
        border-bottom:none;
        color:white;
        margin-left:2em;
        &:hover{
            color:$ClrTheme;
        }
    }
}
#lnkReturnSystem{
    visibility:hidden;
    margin-left:2em;
    &>a{
        background-color:$ClrFocus;
        color:$ClrFocusTxt;
        &:hover{
            background-color:$ClrFocus;
            color:$ClrFocusTxt;
        }
    }
}

#chapter1{
    height:100%;
    position:fixed;
    top:0;
    z-index:1;
    min-height:80%;
    background-image: url('/SiteUI/Imgs/loginBk.jpg');
    background-position:center top;
    background-size:cover;
    background-repeat:no-repeat;
}
.chapter1Mask{
    height:100%;
    width:100%;
}
#mainRow{
    height:85%;
    padding-top:15em;
}

#siteTitle{
    color:white;
    padding-left:4rem;
    padding-top:2rem;
    text-shadow:2px 2px 2px black;
    &>span{
        font-size:2.8rem;
        font-weight:bolder;
    }
    &>h1{
        padding-left:2em;
    }
    &>h3{
        padding-left:2em;
    }
}
#rowLogin{
    
}

#framLogin{
    height:20rem;
    width:100%;
    border:none;
    background-color:white;
}

#loginStatus{
    width:100%;
    text-align:center;
    &>div{
        display:inline-block;
        width:40%;
        height:250px;
        //background-color:#e9eaeb;
        border-radius:2px;
        background-image: url('Imgs/glassBk.png');
        background-repeat:no-repeat;
        background-size:cover;
        &>img{
            width:50%;
            margin-top:2rem;
        }
        &>a.LinkBlock{
            color:white;
            width:80%;
        }
        &>#loginOut{
            float:right;
            margin-right:10%;
            margin-top:5px;
            color:white;
        }
    }

}

@-moz-keyframes downArrow{
    0%{
        background-position-y:center;
        opacity:0.3;
    }
    70%{
        background-position-y:bottom;
        opacity:1;
    }
    100%{
        background-position-y:center;
        opacity:0.5;
    }
}
@-webkit-keyframes downArrow{
    0%{
        background-position-y:center;
        opacity:0.3;
    }
    70%{
        background-position-y:bottom;
        opacity:1;
    }
    100%{
        background-position-y:center;
        opacity:0.5;
    }
}
@keyframes downArrow{
    0%{
        background-position-y:center;
        opacity:0.3;
    }
    70%{
        background-position-y:bottom;
        opacity:1;
    }
    100%{
        background-position-y:center;
        opacity:0.5;
    }
}
#ourProduct {
    & > h3 {
        width: 100%;
        text-align: center;
        color: white;
        text-shadow: 2px 2px 2px black;
    }
}
#nextArrow {
    background-repeat: no-repeat;
    height: 40px;
    width: 100%;
    margin: 0;
    background-size: auto 20px;
    background-image: url('') /*../Imgs/ourProductArrow.gif*/;
    background-position-x:center;
    -moz-animation-name: downArrow;
    -o-animation-name: downArrow;
    -webkit-animation-name: downArrow;
    animation-name: downArrow;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -moz-animation-play-state: running;
    -o-animation-play-state: running;
    -webkit-animation-play-state: running;
    animation-play-state: running;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

#chapter2{
    position:relative;
    z-index:1;
    width:100%;
    padding-bottom:5rem;
    background-color:#e9eaeb;
    &>.chpTitle{
        color:$ClrTheme;
    }
}
.chpTitle{
    display:inline-block;
    width:100%;
    text-align:center;
    margin-top:1em;
}
.chpTitle_bottom{
    height:2em;
    min-height:2em;
    background-image: url('/SiteUI/Imgs/ourProductArrow2.gif');
    background-repeat:no-repeat;
    background-size:auto 100%;
    background-position:center center;
}

#chapter3{
    position:relative;
    width:100%;
    z-index:1;
    background-color:white;
    padding-bottom:5rem;
    &>.chpTitle{
        color:$ClrThemeHotTxt;
    }
}

#aggregation{
    margin-top:2em;
    color:white;
    &>div{
        margin-top:2em;
        text-align:center;
        height:20em;
        &>i{
            @include soicon(white);
            font-size:600% !important;
        }
    }
}
.argIcon{
    font-size:700% !important;
}


#chapter4{
    position:relative;
    width:100%;
    z-index:1;
    background-color:#e9eaeb;
    padding-bottom:5rem;
    &>.row{
        height:8em;
        text-align:center;
        background-image: url('') /*../Imgs/b_gezi.png*/;
        background-repeat:repeat-x;
        background-position:left center;
    }
}
.infolize{
    line-height:1.4em;
    padding:1em;
    border-right:1px solid gray;
    &.end{
        border:none;
    }
}

#nxtWebOffice{
    color:$ClrImportant;
}
#chapter5{
    position:relative;
    width:100%;
    z-index:1;
    padding-bottom:5rem;
    background-color:white;
  
}
#invite{
    height:100%;
    padding:2em 1em;
    background-color:#f75e5e;
    color:white;
}
.customVoice{
    margin:3em auto;
    text-align:center;
    &>img{
        height:8em;
        width:8em;
        border-radius:4em;
    }
    &>span{
        display:inline-block;
        width:100%;
        height:2em;
        line-height:2em;
        text-align:center;
    }
    &>div{
        display:inline-block;
        width:10em;
        min-height:1px;
        height:1px;
        border:1px solid $ClrTheme;
    }
    &>p{
        padding:1em 15%;
    }
}

#chapter6{
    position:relative;
    width:100%;
    z-index:1;
    background-color:#e9eaeb;
    padding-bottom:5rem;
}

/*#region 页面帮助*/
#pageHelper {
    position: fixed;
    bottom: 60px;
    right: 20px;
    background-color: #bababa;
    -moz-transition: all ease 0.5s;
    -o-transition: all ease 0.5s;
    -webkit-transition: all ease 0.5s;
    transition: all ease 0.5s;
    z-index:999999;
    & > ul {
        width: 4em;
        margin: 0;
        padding: 0;
        list-style: none;
        cursor: pointer;
        & > li {
            height: 4em;
            padding: 0;
            &:hover {
                background-color: rgba(0,0,0,0.75);
            }
        }
    }
}
#goTop {
    display: none;
    background-image: url('/SiteUI/Imgs/goTop.gif');
    background-size: auto 8em;
    &:hover {
        background-position: 0 -4em;
    }
}
#valueChain_title1{
  margin-top:2rem;
  text-align:center;

}
.valueChain_title2{
    color:#3987c5;
    margin-top:2.5rem
}
.tl_register{
    width:10rem;
     height:4rem;
     font-size:1.5rem;
     line-height:4rem;
     background-color:#3987c5;
     display:inline-block;
     color:white;
     border-radius:5px;
     cursor:pointer;
}
.tl_register:hover{
    background:#4495D6;
}
.valueChain_xian{
    height:1px; 
    background:#808080;
    margin-top:4rem
}
.valueChain_top{
       margin-top:4rem;
}

#serviceChain_content{
     margin-top:20rem;
}
.index_color{
    color:#3987c5;
}
#serviceChain_title{
  margin-top:5rem;
 
    }
#application_title{
    margin-top:15rem;
}
#tl_login{
    text-align:center;
    }
.tl_img{
    width:100%;
     margin-top:-3rem;
}
.tl_fill{
    margin-top:5rem;
}
.tl_imgTop{
    margin-top:3.5rem;
}
.index_right{
    text-align:right;
}
#chapter7{
    position:relative;
    z-index:1; 
    width:100%;
    background-color:white;
  
}
#chapter8{
     position:relative;
    width:100%;
    height:100%;
    z-index:1;
    background-color:#e9eaeb;
}
#chapter9{
    position:relative;
    width:100%;
    z-index:1;
    background-color:white;
  
}
.agreement_title{
    color:white;
    text-align:center;
    height:7rem;
}
.agreement_title_line{
    line-height:4rem;
}
.agreement_color{
    background-color:#508cbb;
}
.agreement_fill{
    margin-top:2rem;
    margin-bottom:5rem;
}

/*#endregion*/

/*#region 新闻页面*/

#New-title{
    text-align:center;
    margin-bottom:3rem
}
#NewsList{
    &>div{
        width:30%;
        background-color:white;
        padding:2rem;
        float:left ;
        box-shadow:1px 1px 5px #ccc;
        &:hover{
                margin-top:-0.5rem;
                box-shadow: -1px 0 8px #ccc, //左边阴影
                0 -1px 8px #ccc, //顶部阴影
                0 1px 8px #ccc, //底部阴影
                1px 0 8px #ccc; //右边阴影 ;
                transition:1s;
                cursor:pointer;
                 &>.NewsPictures{
                     &>img{
                    width:110%;
                    margin-left:-1rem;
                    margin-top:-1rem;
                     transition:1s;
                     }
                }
             }
        &>.NewsPictures{
            height:12rem;
            overflow:hidden;
             &>img{
                width:100%;
        }
        }
        &>span{
            height:8rem;
            display:inline-block;
        }
        &>div{
            margin-top:1rem;
            color:#c86a6a;
            
            &>span{
                display:inline-block;float:right;
                 color:gray;
            }
        }
    }
    &>span{
        width:5%;float:left;display:inline-block;
     }
}
/*#endregion*/
.news-article{
    margin-top:10rem;
    margin-bottom:5rem;
    display:none;
      &>h3{
        text-align:center;
    }
      &>div{
          text-align:right;
          margin-right:8rem;
          margin-bottom:2rem;
      }
}
.CooperativePartner{
    text-align:center;
    margin-bottom:2rem
}
.CooperativeEnterprise{
    margin-bottom:8rem;
    &>div{
        width:30%;float:left;border:1px solid;
        &>img{
            width:100%;
            height: 12rem;
        }
    }
    &>span{
        width:5%;display:inline-block;float:left
    }
}


#pageFoot{
    padding-top:1rem;
    color:$ClrThemeTxt;
    z-index:1;
    background-color:$ClrThemeBk;
    &>div{
        line-height:2rem;
    }
}
#aboutUs{
    line-height:3rem;
    padding-top:2rem;
}
#connactUs{
    &>h3{
        color:white;
    }
}
#mailUs{
    &>h3{
        color:white;
    }
    &>a{
        &>i{
            @include soicon($ClrThemeTxt);
        }
        &:hover{
            &>i{
                @include soicon($ClrTheme);
            }
        }
    }
}
#wxUs{
    &>h3{
        color:white;
    }
    &>img{
        width:80%;
    }
}


